<%--
  Copyright (c) 2024,  科泰集团教研团队
  版权所有，请勿侵权
  author: 科泰集团教研团队
  createTime: 2024/4/10 16:52
  lastModify: 2024/4/10 16:52
  version 1.0.0
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>科泰超市管理系统</title>
        <%--  导入公共头部信息  --%>
        <%@include file="/WEB-INF/layout/head.jsp" %>
        <%--  有其他css样式可以在这里引入或编写  --%>
    </head>

    <body class="nav-md">
        <div class="container body">
            <div class="main_container">
                <!-- 引入左边导航菜单 -->
                <jsp:include page="/WEB-INF/layout/left-nav.jsp"></jsp:include>
                <!-- 引入左边导航菜单 -->

                <!-- 引入顶部导航 -->
                <jsp:include page="/WEB-INF/layout/top-nav.jsp"></jsp:include>
                <!-- 引入顶部导航 -->

                <!-- 内容部分，需自己设计 -->
                <div class="right_col" role="main">
                    <div class="">
                        <div class="row">
                            <div class="col-md-12 col-sm-12 col-xs-12">
                                <div class="x_panel">
                                    <div class="x_title">
                                        <h2>查询用户列表</h2>
                                        <div class="clearfix"></div>
                                    </div>
                                    <div class="x_content">
                                        <form id="search-form" action="${ctx}/main/user/page" method="post"
                                              data-parsley-validate class="form-inline">
                                            <input type="hidden" name="pageNo" value="${pageInfo.pageNo}" />
                                            <input type="hidden" name="pageSize" value="${pageInfo.pageSize}">
                                            <div class="form-group col-md-3 col-sm-3 col-xs-12">
                                                <label class="control-label text-center col-md-4 col-sm-4 col-xs-12"
                                                       for="realName">用户名 </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12">
                                                    <input type="text" id="realName" name="realName" value="${condition.realName}"
                                                           class="form-control">
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3 col-sm-3 col-xs-12">
                                                <label class="control-label text-center col-md-4 col-sm-4 col-xs-12"
                                                       for="roleId">角色 </label>
                                                <div class="col-md-6 col-sm-6 col-xs-12">
                                                    <select id="roleId" name="roleId" class="form-control">
                                                        <option value="">--------------- 全部 ---------------</option>
                                                        <c:forEach items="${roleList}" var="role">
                                                            <option value="${role.id}"
                                                                ${role.id == condition.roleId ? "selected='selected'" : ""}>${role.roleName}</option>
                                                        </c:forEach>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="form-group col-md-3 col-sm-3 col-xs-12">
                                                <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">
                                                    <button type="submit" id="search-btn" class="btn btn-success">查询</button>
                                                    <button type="button" onclick="$(this).closest('form').find(':input').val('')"
                                                            id="reset-btn" class="btn btn-warning">重置</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 col-sm-12 col-xs-12">
                                <div class="x_panel">
                                    <div class="x_content">
                                        <p class="text-muted font-13 m-b-30">
                                            <button type="button" id="add-btn" class="btn btn-success">添加</button>
                                        </p>
                                        <div class="table-responsive">
                                            <table id="datatable-checkbox"
                                               class="table table-striped table-bordered jambo_table bulk_action">
                                                <thead >
                                                    <tr class="headings">
<%--                                                        <th>--%>
<%--                                                            <input type="checkbox" id="check-all" class="flat">--%>
<%--                                                        </th>--%>
                                                        <th class="column-title">账号</th>
                                                        <th class="column-title">真实姓名</th>
                                                        <th class="column-title">角色名称</th>
                                                        <th class="column-title">性别</th>
                                                        <th class="column-title">年龄</th>
                                                        <th class="column-title">电话号码</th>
                                                        <th class="column-titl no-link last" width="160px"><span class="nobr">操作</span></th>
                                                        <th class="bulk-actions" colspan="8">
                                                            <a class="antoo" style="color:#fff; font-weight:500;">批量操作 ( <span class="action-cnt"> </span> ) <i class="fa fa-chevron-down"></i></a>
                                                        </th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <c:forEach items="${pageInfo.data}" var="user">
                                                        <tr>
<%--                                                            <td class="a-center ">--%>
<%--                                                                <input type="checkbox" class="flat" name="table_records">--%>
<%--                                                            </td>--%>
                                                            <td class=" ">${user.account}</td>
                                                            <td class=" ">${user.realName}</td>
                                                            <td class=" ">${user.sysRole.roleName}</td>
                                                            <td class=" ">${user.sex == 1 ? '女' : '男'}</td>
                                                            <td class=" ">${user.age}</td>
                                                            <td class=" ">${user.phone}</td>
                                                            <td class=" last">
                                                                <button onclick="view(${user.id})" data-original-title="查看"  class="btn btn-sm btn-default" type="button"  data-placement="top" data-toggle="tooltip"><i class="fa fa-eye"></i></button>
                                                                <button onclick="edit(${user.id})" data-original-title="修改"  class="btn btn-sm btn-default" type="button" data-placement="top" data-toggle="tooltip" ><i class="fa fa-edit"></i></button>
                                                                <c:if test="${sessionScope.loginUser.roleId == 1 && sessionScope.loginUser.id != user.id}">
                                                                    <button onclick="del(${user.id},'${user.account}')"  data-original-title="删除"  class="btn btn-sm btn-default" type="button" data-placement="top" data-toggle="tooltip" ><i class="fa fa-trash-o"></i></button>
                                                                </c:if>
                                                            </td>
                                                        </tr>
                                                    </c:forEach>
                                                </tbody>
                                            </table>
                                        </div>
                                        <%-- 传递参数将查询form的id传给分页组件  --%>
                                        <c:import url="/WEB-INF/layout/common/pagination.jsp">
                                            <c:param name="formId" value="search-form"></c:param>
                                        </c:import>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 内容部分，需自己设计 -->

                <div class="modal fade" id="view-dialog" tabindex="-1" >
                    <div class="modal-dialog">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                <h4 class="modal-title" id="view-dialog-title">查看用户信息</h4>
                            </div>
                            <div class="modal-body">
                                <div class="form-horizontal form-label-left">
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            账号
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-account"
                                                 class="form-control-static col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            真实姓名
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-realName"
                                                    class="form-control-static col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            性别
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-sex"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            出生日期
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-birthday"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            手机号码
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-phone"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            地址
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-address"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            角色
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-role-roleName"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            创建时间
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-createdTime"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                    <div class="item form-group">
                                        <label class="control-label col-md-3 col-sm-3 col-xs-12" >
                                            修改时间
                                        </label>
                                        <div class="col-md-6 col-sm-6 col-xs-12">
                                            <div id="view-updatedTime"
                                                 class="form-control-static  col-xs-12"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 底部内容 -->
                <jsp:include page="/WEB-INF/layout/footer.jsp"></jsp:include>
                <!-- 底部内容 -->

                <%-- 引入自己的JS代码 --%>
                <script src="${ctx}/statics/js/user/page.js"></script>
            </div>
        </div>
    </body>
</html>
